<template>
  <div>
    <a-row :gutter="14">
      <a-col :span="8" v-for="(item, index) in props.pictureList" :key="index" style="padding: 10px">
        <a-card hoverable style="width: 280px; height: 300px">
          <template #cover>
            <img :src="item.src" style="width: 100%; height: 220px" />
          </template>
          <a-card-meta :title="item.title" style="height: 50px"> </a-card-meta>
        </a-card>
      </a-col>
    </a-row>
  </div>
</template>
<script setup lang="ts">
import { withDefaults, defineProps } from 'vue';
import { picture } from '@/model/data/picture';
interface Props {
  pictureList: picture[];
}

const props = withDefaults(defineProps<Props>(), {
  pictureList: () => []
});
</script>
<style></style>
